<!DOCTYPE>
<html>
<head>
	<meta charset="utf-8" />
	<title>商品介绍---电商网站</title>	
	<link rel="stylesheet" type="text/css" href="css/reset.css">
	<link rel="stylesheet" type="text/css" href="css/main.css">	
</head>
<body class="grey">
<div class="headerBar">
	<div class="topBar">
		<div class="comWidth">
			<div class="leftArea">
				<a href="#" class="collection">收藏慕课</a>
			</div>
			<div class="rightArea">
				欢迎来到慕课网！<a href="">[登录]</a><a href="">[免费注册]</a>
			</div>
		</div>
	</div><!-- topBar结束 -->
	<div class="logoBar ">
		<div class="comWidth">	
			<div class="logo fl">
				<a href="#"><img src="images/logo.png" alt="慕课网"></a>
			</div>
			<div class="search_box fl">
				<input type="text" class="search_text fl" />
				<input type="button" value="搜 索" class="search_btn fr">
			</div>
			<div class="shopCar fr">
				<span class="shopText fl">购物车</span>
				<span class="shopNum fl">25</span>
			</div>
		</div>
	</div><!--  logoBar结束  -->
	<div class="navbox">
		<div class="comWidth">
			<div class="shopClass fl">
				<h3  class="active">全部商品分类<i></i></h3>
			</div>
			<ul class="nav fl">
				<li><a href="#">数码城</a></li>
				<li><a href="#">天黑黑</a></li>
				<li><a href="#">团购</a></li>
				<li><a href="#">二手特卖</a></li>
				<li><a href="#">名品会</a></li>
			</ul>
		</div>
	</div><!-- navBar结束 -->
</div><!-- headerBar结束 -->
<div class="hr_15"></div>
<div class="userPosition comWidth clearfix">
	<a href="#">首页</a>
	<span>&nbsp;&gt;&nbsp;</span>
	<a href="#">平板电脑</a>
	<span>&nbsp;&gt;&nbsp;</span>
	<a href="#">Apple / 苹果</a>
</div>
<div class="hr_15"></div>
<div class="description_info comWidth clearfix">
	<div class="leftArea">
		<div class="discription_imgs">
			<div class="big">
				<img src="images/des.gif" alt="">
			</div>
			<ul class="des_smimg clearfix">
				<li><a href="#"><img src="images/des_sm01.gif" alt="" class="active"></a></li>
				<li><a href="#"><img src="images/des_sm02.gif" alt=""></a></li>
				<li><a href="#"><img src="images/des_sm01.gif" alt=""></a></li>
				<li><a href="#"><img src="images/des_sm02.gif" alt=""></a></li>
				<li><a href="#"><img src="images/des_sm01.gif" alt=""></a></li>
			</ul>
		</div>
	</div>
	<div class="rightArea">
		<div class="des_content">
			<h3 class="des_content_tit">全网底价 Apple 苹果 iPad mini 16G wifi版 平板电脑 前白后银 MD531CH/A 白两色生产批次不同混合发货
			</h3>
			<div class="dl clearfix">
				<div class="dt">慕课价</div>
				<div class="dd">
					<span class="des_money"><em>￥</em>999</span>
				</div>
			</div>
			<div class="dl clearfix">
				<div class="dt">优惠</div>
				<div class="dd">
					<span class="hg">
						<i class="hg_icon">满换购</i>
						购ipad加价优惠够配件或USB充电插座
					</span>
				</div>
			</div>
			<div class="des_position">
				<div class="dl clearfix">
					<div class="dt">送到</div>
					<div class="dd">
						<div class="select">
							<h3>海淀区五环内</h3><span></span>
							<ul class="show_select">
								<li>通州</li>
								<li>海淀</li>
								<li>通州</li>
							</ul>
						</div>
					</div>
					<span class="theGoods">有货，可当日出库</span>
				</div>
				<div class="dl clearfix">
					<div class="dt colorSet">选择颜色</div>
					<div class="dd clearfix">
						<div class="des_item des_item_active">
							黑色
						</div>
						<div class="des_item">
							白色
						</div>
						<div class="des_item">
							黄色
						</div>
					</div>
				</div>
				<div class="dl clearfix">
					<div class="dt">选择版本</div>
					<div class="dd clearfix">
						<div class="des_item des_item_sm des_item_active">
							WIFI Cellular 32G
						</div>
						<div class="des_item des_item_sm">
							WIFI Cellular 64G
						</div>
						<div class="des_item des_item_sm">
							WIFI 16G
						</div>
						<div class="des_item des_item_sm">
							WIFI Cellular 64G
						</div>
						<div class="des_item des_item_sm">
							WIFI Cellular 64G
						</div>
						<div class="des_item des_item_sm">
							WIFI Cellular 64G
						</div>
						<div class="des_item des_item_sm">
							WIFI Cellular 64G
						</div>
						<div class="des_item des_item_sm">
							WIFI 16G
						</div>
					</div>
				</div>
				<div class="dl clearfix">
					<div class="dt colorSet">数 量</div>
					<div class="dd clearfix">
						<div class="des_number">
							<div class="reduction">-</div>
							<div class="des_input">
								<input type="text" />
							</div>
							<div class="plus">+</div>
						</div>
						<span class="xg">限购<em>9件</em></span>
					</div>
				</div>
				<div class="des_select">
					已选择<span>"白色|WIFI 16G"</span>
				</div>
				<div class="shop_buy">
					<a href="#" class="shopping_btn"><span class="buyCar"></span>立即购买</a>
					<span class="line"></span>
					<a href="#" class="buy_btn"><span class="buyCar"></span>加入购物车</a>
				</div>
				<div class="fp">
					注意：此商品可提供普通发票，不提供增值税发票。
				</div>
			</div><!-- des_position结束 -->
		</div>		
	</div>
</div>
<div class="hr_15"></div>
<div class="des_info comWidth clearfix">
	<div class="leftArea">
		<div class="recommend">
			<h3 class="tit">同价位</h3>
			<div class="item">
				<div class="img_item">
					<a href="#"><img src="images/lb02.gif" alt=""></a>
				</div>
				<p><a href="#">文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍</a></p>
				<p class="money">￥888</p>				
			</div><!-- item结束 -->	
			<div class="item">
				<div class="img_item">
					<a href="#"><img src="images/lb02.gif" alt=""></a>
				</div>
				<p><a href="#">文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍</a></p>
				<p class="money">￥888</p>				
			</div><!-- item结束 -->	
			<div class="item">
				<div class="img_item">
					<a href="#"><img src="images/lb02.gif" alt=""></a>
				</div>
				<p><a href="#">文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍</a></p>
				<p class="money">￥888</p>				
			</div><!-- item结束 -->	
		</div><!-- recommend -->
		<div class="recommend">
			<h3 class="tit">看了还买</h3>
			<div class="item">
				<div class="img_item">
					<a href="#"><img src="images/lb02.gif" alt=""></a>
				</div>
				<p><a href="#">文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍</a></p>
				<p class="money">￥888</p>				
			</div><!-- item结束 -->	
			<div class="item">
				<div class="img_item">
					<a href="#"><img src="images/lb02.gif" alt=""></a>
				</div>
				<p><a href="#">文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍</a></p>
				<p class="money">￥888</p>				
			</div><!-- item结束 -->	
			<div class="item">
				<div class="img_item">
					<a href="#"><img src="images/lb02.gif" alt=""></a>
				</div>
				<p><a href="#">文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍文字介绍</a></p>
				<p class="money">￥888</p>				
			</div><!-- item结束 -->	
		</div><!-- recommend -->
	</div>
	<div class="rightArea">
		<div class="des_infoContent">
			<ul class="des_tit">
				<li class="active"><span>产品介绍</span></li>
				<li><span>产品评价(1243)</span></li>
			</ul>
			<div class="ad">
				<a href="#"><img src="images/ad01.png" alt=""> </a>
			</div>
			<div class="info_text">
				<div class="info_tit">
					<h3>强烈推荐</h3><h4>货比三家，还选</h4>
				</div>
				<p>
					现在就是买mini的好时候！换代清仓直降，但苹果品质不变！A5双核，内置Lightning闪电接口，正反可插，方便人性。小身材，炫丽的7.9英寸显示屏，7.2mm的厚度，薄如铅笔。女生包包随身携带更时尚！facetime视频通话，与密友24小时畅聊不断线。微信倾力打造，你的智能助理。苹果的牌子就不用我说了，1111补仓，存货不多哦！
				</p>
				<div class="hr_30"></div>
				<div class="info_tit">
					<h3>强烈推荐</h3><h4>货比三家，还选</h4>
				</div>
				<p>
					现在就是买mini的好时候！换代清仓直降，但苹果品质不变！A5双核，内置Lightning闪电接口，正反可插，方便人性。小身材，炫丽的7.9英寸显示屏，7.2mm的厚度，薄如铅笔。女生包包随身携带更时尚！facetime视频通话，与密友24小时畅聊不断线。微信倾力打造，你的智能助理。苹果的牌子就不用我说了，1111补仓，存货不多哦！
				</p>
				<div class="hr_30"></div>
				<div class="ad">
				<a href="#"><img src="images/pad.png" alt=""> </a>
			</div>
			</div>
		</div>
		<div class="hr_15"></div>
		<div class="des_infoContent clearfix">
			<h3 class="shopDes_tit">商品评价</h3>
			<div class="score_box clearfix">
				<div class="score">
					<span>4.7</span> <em>分</em>
				</div>
				<div class="scroe_speed">
					<ul class="score_speed_text">
						<li class="speed_01">非常不满意</li>
						<li class="speed_02">不满意</li>
						<li class="speed_03">一般</li>
						<li class="speed_04">满意</li>
						<li>非常满意</li>
					</ul>
					<div class="score_num">
						4.7<i></i>
					</div>
					<p class="pp">共18939位慕课网友参与评分</p>
				</div>
			</div>
			<div class="review_tab">
				<ul class="review fl">
					<li><a href="#" class="active">全部</a></li>
					<li><a href="#">满意(17490)</a></li>
					<li><a href="#">一般(549)</a></li>
					<li><a href="#">不满意(743)</a></li>
				</ul>
				<div class="review_sort fr">
					<a href="#" class="review_time">时间排序</a>
					<a href="#" class="review_reco">推荐排序</a>
				</div>
			</div>
			<div class="review_list clearfix">
				<div class="reviewUser_head fl">
					<div class="review_user">
						<img src="images/des_img.png" alt="">
						<p>61***42</p>
						<p>金色会员</p>
					</div>
				</div>
				<div class="review_cont">
					<div class="review_t clearfix">
						<div class="starts_box fl">
							<span class="stars"></span><span class="stars"></span><span class="stars"></span><span class="stars"></span><span class="stars"></span>
						</div>
						<span class="stars_text fl">5分 满意</span>
					</div>
					<p>挺不错的，信赖慕课</p>
					<p><a href="#" class="ding">顶(0)</a><a class="#" class="#">踩(0)</a></p>
				</div>
			</div>
			<div class="review_list clearfix">
				<div class="reviewUser_head fl">
					<div class="review_user">
						<img src="images/des_img.png" alt="">
						<p>61***42</p>
						<p>金色会员</p>
					</div>
				</div>
				<div class="review_cont">
					<div class="review_t clearfix">
						<div class="starts_box fl">
							<span class="stars"></span><span class="stars"></span><span class="stars"></span><span class="stars"></span><span class="stars"></span>
						</div>
						<span class="stars_text fl">5分 满意</span>
					</div>
					<p>挺不错的，信赖慕课</p>
					<p><a href="#" class="ding">顶(0)</a><a class="#" class="#">踩(0)</a></p>
				</div>
			</div>
			<div class="hr_30"></div>
			<div class="page">
				<a href="#">上一页</a><a href="#">1</a><a href="#">2</a><a href="#">3</a>
				<a href="#">4</a><a href="#">5</a><a href="#">6</a><a href="#">7</a>
				<a href="#">8</a><span class="hl">...</span><a href="#">200</a>
				<a href="#">下一页</a><span class="morePage">共200页，到第</span>
				<input type="text" class="pageNum"> 页
				<input type="button" class="page_btn" value="确定">
			</div>
			<div class="hr_30"></div>
		</div>
	</div><!-- rightArea结束  -->
</div>
<div class="hr_15"></div>
<div class="footer"><!-- -->
	<p>
		<a href="#">网站首页</a><i>|</i>
		<a href="#">人才招聘</a><i>|</i>
		<a href="#">联系我们</a><i>|</i>
		<a href="#">慕课云</a><i>|</i>
		<a href="#">关于我们</a><i>|</i>
		<a href="#">讲师招募</a><i>|</i>
		<a href="#">意见反馈</a><i>|</i>
		<a href="#">友情链接</a>
	</p>
	<p>Copyright &copy; 2015 imooc.com All Rights Reserved | 京ICP备 13046642号-2</p>
	<p class="web">
		<a herf="#"><img src="images/weblogo.gif" alt=""></a>
		<a herf="#"><img src="images/weblogo.gif" alt=""></a>
		<a herf="#"><img src="images/weblogo.gif" alt=""></a>
		<a herf="#"><img src="images/weblogo.gif" alt=""></a>
	</p>
</div>
</body>
</html>
